<template>
  <com-card>
    <div slot="com_header">
      <el-alert
        title="添加商品信息"
        type="info"
        center
        show-icon
        :closable="false"
      ></el-alert>
    </div>
    <div slot="com_content">
      <el-steps  :active="active-0" finish-status="success" :align-center="true" status="wait">
        <el-step title="基本信息"></el-step>
        <el-step title="商品管理"></el-step>
        <el-step title="商品属性"></el-step>
        <el-step title="商品图片"></el-step>
        <el-step title="商品内容"></el-step>
        <el-step title="完成"></el-step>
      </el-steps>
      <el-tabs tab-position="left" style="height: 500px" v-model="active">
      
        <el-tab-pane label="基本信息" name="0">
            <el-form :model="saveObj" :rules="checkform" ref="ruleForm">
              <el-form-item label="商品名称" porp="goods_name">
                <el-input v-model="saveObj.goods_name"></el-input>
              </el-form-item>
               <el-form-item label="商品价格" prop="goods_price">
                <el-input v-model="saveObj.goods_price"></el-input>
              </el-form-item>
               <el-form-item label="商品数量" prop="goods_number">
                <el-input v-model="saveObj.goods_number"></el-input>
              </el-form-item>
               <el-form-item label="商品重量" prop="goods_weight">
                <el-input v-model="saveObj.goods_weight"></el-input>
              </el-form-item>
            </el-form>
          </el-tab-pane>
        <el-tab-pane label="商品管理" name="1">商品管理</el-tab-pane>
        <el-tab-pane label="商品属性" name="2">商品属性</el-tab-pane>
        <el-tab-pane label="商品图片" name="3">商品图片</el-tab-pane>
        <el-tab-pane label="商品内容" name="4">商品内容</el-tab-pane>
        <el-tab-pane label="提交" name="5">提交</el-tab-pane>
      </el-tabs>
    </div>
  </com-card>
</template>

<script>
import {api_tianjia} from "../api/Categories.js"
import ComCard from "../components/comCard/index.vue";
export default {
  components: {
    ComCard,
  },
  data() {
    return {
      active:0,//步骤条的激活步数从0开始
      typelist:[],//下拉框的数据源
//       goods_name	商品名称
// goods_cat	以为','分割的分类列表
// goods_price	价格
// goods_number	数量
// goods_weight	重量
// goods_introduce	介绍

      saveObj:{
        goods_name:"",
        goods_price:"",
        goods_number:" ",
        goods_weight:" ",
        goods_cat:"",
      },
      checkform:{
            goods_name:[
              {required:true,message:'请输入送名称',trigger:'blur'}
            ]
      }
    
    };
  },
  mounted() {
    this.query();
  },
  methods:{
    async query(){
      let rst=await api_tianjia(this.saveObj);
      console.log(rst);
    }
  }
};
</script>

<style lang="less" scoped>
</style>